import React, { Component, PropTypes } from 'react';
import { connect } from 'dva';
import { Icon,Menu,Dropdown } from 'antd';
import { Link } from 'dva/router';
import EditPasswordModal from './EditPasswordModal';
import styles from '../../routes/IndexPage.css';
import { getItem, inArray } from '../../utils/utils';
const permissionList = localStorage.getItem("permissions")?JSON.parse(localStorage.getItem("permissions")):{};
const data = permissionList.map( d => d );
var isShowPeiXian=false;
class Header extends Component {

    constructor(props) {
        super(props);
    }

    componentWillMount(){
        window.getiframemsgmd = function(data){//注册消息接收事件
            console.log(data+"接收");
        }
       
    }

    render() {

      const { onLogout, realName, dispatch } = this.props;

      const modalProps = {
        visible: this.props.common.modalVisible,
        maskClosable: false,
        confirmLoading: this.props.common.confirmLoading,
        title: '修改密码',
        newKey : this.props.common.newKey,
        onOk (data) {
           dispatch({
                type: 'common/editPassword',
                payload: data,
            })
        },
        onCancel () {
            dispatch({
                type: 'common/hideModal',
            })
        },
      }

       const onClick = () => {
          dispatch({
           type: 'common/showModal',
         })
       }
      
      const onPeixian = () => {
           isShowPeiXian=!isShowPeiXian;
           window.getiframemsg(isShowPeiXian);//发行消息
       }

      const menu = (
        <Menu>
            <Menu.Item>           
            <a href="javascript:void(0)" onClick={onClick}>修改密码</a>
            </Menu.Item>
            <Menu.Item>
            <a href="javascript:void(0)" onClick={onLogout}>退出</a>
            </Menu.Item>
        </Menu>
      );

      return(
        <div className={styles.header}>
            <div className={"menu-header"} style={{marginRight:'50px',float:"left"}}>
                <Menu
                    defaultOpenKeys={['sub1']}
                    mode="horizontal"
                >
                    <Menu.Item key='1'>
                        <Link to='/'><span><i className="asset">&#xe608;</i><span>首页</span></span></Link>
                    </Menu.Item>
                    {/* {inArray('jcv', data) > -1 ? 
                        <Menu.Item key='jcv'>
                            <Link to='virtual'><span><i className="asset">&#xe601;</i><span>虚拟实景</span></span></Link>
                        </Menu.Item>:''}
                         <Menu.Item>           
                            <a href="javascript:void(0)" onClick={onPeixian}>显示配线</a>
                        </Menu.Item>  */}
                    {inArray('maintain', data) > -1 ? 
                        <Menu.Item key='maintain'>
                            <Link to='asset/maintain'><span><i className="asset">&#xe60f;</i><span>资产卡片</span></span></Link>
                        </Menu.Item>:''}
                </Menu>
            </div>
            <div className={styles.userbox}>
            <Dropdown overlay={menu} placement="bottomLeft">
                <a className={styles.username} href="javascript:void(0)">
                {realName}<Icon type="caret-down" />
                </a>
            </Dropdown>
            </div>
            <EditPasswordModal {...modalProps} />
        </div>    
      );
    }
}


function mapStateToProps(state) {
  return { common : state.common,loading:state.loading.models.common};
}

export default connect(mapStateToProps)(Header);